<template>
  <div>
    <input
      type="text"
      v-model='todo'
      @keydown.enter="submit"
    >
    <ul>
      <li v-for='item in todoAry'>
        {{item.text}}
        <button @click='del(item)'>X</button>
      </li>
    </ul>
  </div>
</template>
<script>
// @ is an alias to /src
export default {
  name: "XXX",
  data() {
    return {
      todo: "",
      todoAry: [],
    };
  },
  methods: {
    submit(e) {
      // if (e.keyCode == 13) {
      //   console.log("提交");
      // }
      // console.log("提交");
      this.todoAry.push({
        id: Math.random(),
        text: this.todo,
      });
      this.todo = "";
    },
    del(item) {
      console.log(this.todoAry);
      // 数组的变异方法 pop push shift unshift   splice reverse sort
      this.todoAry = this.todoAry.filter((val) => val.id !== item.id);
    },
  },
};
</script>
<style lang="less">
</style>